<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="app">
        {{damu.wife.son.age}}
        <p v-text="damu.wife.son.sonname"></p>
    </div>
</body>
<script src="./MVVM/mvvm.js"></script>
<script src="./MVVM/observer.js"></script>
<script src="./MVVM/compile.js"></script>
<script src="./MVVM/watcher.js"></script>
<script>
    /*vue内部为每一个data属性包括深层次属性分配一个dep
            一个dep对应一个属性*/

    // 一个指令对应一个watcher

    /*
        dep和watcher之间是多对多的关系
            dep有一个subs数组
            wtacher有一个depIds对象
     */



    var vm = new MVVM({
        el:"#app",
        data:{
            damu:{
                damuname:"达姆",
                age:18,
                wife:{
                    wifename:"冬雨",
                    age:28,
                    son:{
                        sonname:"小达姆",
                        age:0.5
                    }
                }
            },
            a:"a",
            b:"b",
            c:"c"
        }
    })
</script>
</html>